
import loayt from "./index.module.less"
import { LeftOutline } from 'antd-mobile-icons'
import { SafeArea } from 'antd-mobile'
import { useNavigate } from "react-router-dom"
function Loayt(props) {
    const navigate = useNavigate();
    return (
        <div className={loayt.main}>

            {
                props.children.props.match.route.meta.isNav ?
                    <>
                        <div style={{ background: '#ace0ff' }} >
                            <SafeArea position='top' />
                        </div>
                        <div className={loayt.title}>
                            <div className={loayt.left} onClick={() => {
                                navigate(-1)
                            }}>
                                <LeftOutline />
                            </div>
                            <div className={loayt.center}>{props.children.props.match.route.meta.title}</div>
                            <div className={loayt.right}>
                                
                            </div>
                        </div>
                    </> : ""
            }

            <div className={loayt.contet}>
                {props.children}
            </div>

            <div style={{ background: '#ffcfac' }}>
                <SafeArea position='bottom' />
            </div>
        </div>
    )
}
export default Loayt